<template>
    <div class="login-container">
        <el-form ref="form"  :model="regist" label-width="80px"
            status-icon
            label-position="left" 
            class="demo-ruleForm login-page">
            <h3 class="title">活动加分证明</h3>
            <el-form-item label="活动id" prop="activityId">
                <el-input v-model="regist.activityId"></el-input>
            </el-form-item>
           <!-- 文件加表单5月31日验证可以用:https://gitee.com/seekerliu/lgtour-vue/blob/master/src/components/user/Regist.vue
           https://gitee.com/seekerliu/lgtour-springboot/blob/master/src/main/java/com/zjjtour/lgtour/controller/UserController.java 
           https://gitee.com/seekerliu  https://gitee.com/Pink_oops
           -->
             <el-form-item label="头像">
                <el-upload ref="upfile"
                    action="#"
                    :auto-upload="false"
                    :on-change="handleChange"
                    :show-file-list="false"
                    :limit="1"
                    :name="prove_url"
                    accept="image/png,image/gif,image/jpg,image/jpeg"
                    >
                    <img v-if="prove_url" :src="prove_url" width="80" height="80"/>
                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
            </el-form-item>
            <el-form-item>
                <el-button type="primary"  @click="registNow">创建</el-button>    
                <el-button @click="resetForm('form')">重置</el-button>

            </el-form-item>
        </el-form>
    </div>
</template>

<script>



// import { addprove } from "../api/other";
import axios from "axios";

export default {
    name:'provelist',
    data(){
       
        return{
            regist:{
                activityId:'',
            },
            fileList:[],
            prove_url:'',
         
        }
        
    },
    methods:{
        
        registNow(){
            var fd = new FormData();
            // var face = this.fileList[0];
            fd.append('prove_url',this.fileList[0].raw)
            //console.log(this.fileList[0].raw)
            //fd.append('activityId',JSON.stringify(this.regist) )
            console.log(fd.activityId)
            // console.log(fd.user)

            //this.$axios.defaults.headers.post['Content-Type'] = 'multipart/form-data'


            axios({
                 method:"post", 
                 url:'http://localhost:8085/tb-score-prove/web/AddTbScoreProve?activityId='+this.regist.activityId,
                 data:fd
            }).then(res=>{
               console.log(res)

            })

            // this.$axios.post('/user/regist',fd,).then(res=>{
            //     if(res.data.status === 200){
            //         //console.log(res.data)
            //         this.$message(res.data.msg)
            //         this.$refs.form.resetFields();
            //     }else{
            //         this.$message(res.data.msg)
            //         this.$refs.form.resetFields()
            //         return
            //     }
            // })


            // addprove(fd).then(res=>{
            //     console.log(333)
            //     console.log(res)
            //     if(res.data.code === 200){
            //         //console.log(res.data)
            //         this.$message('上传成功')
            //         this.$refs.form.resetFields();
            //     }else{
            //         this.$message('上传失败')
            //         this.$refs.form.resetFields()
            //         return
            //     }
            // })


        },
         handleChange(file,fileList){
            this.fileList = fileList;
            console.log(file.raw)
            this.imgUrl = URL.createObjectURL(file.raw);
            //生成本地图片的url，直接src显示,删除或移动后url就失效了
            // this.imgUrl = file.data
            console.log(this.imgUrl)
          
         },

          resetForm(formName) {
        this.$refs[formName].resetFields();
      }
     

    }
}

</script>
